import SwiftUI
import Kingfisher

struct FoodDetailView: View {
    
    var foodId: Int
    
    @State private var model: FoodDetailModel!
    
    @Environment(Router.self) private var router
    @Environment(PopupModel.self) private var popup
    @Environment(IndicatorModel.self) private var indicator
    
    var showTags: Bool {
        !model.food.tags.isEmpty
    }
    
    var body: some View {
        ScrollView {
            if model == nil {
                Color.fsF5F5F5
            } else {
                VStack(spacing: 0) {
                    KFImage(URL(string: model.food.imgUrl))
                        .placeholder({
                            WebImageLoadingView()
                        })
                        .onFailureImage(.iconPlaceholderHeader)
                        .resizable()
                        .aspectRatio(contentMode: .fill)
                        .frame(maxWidth: .infinity, maxHeight: 249)
                    VStack(alignment: .leading, spacing: 0) {
                        Text(model.food.title)
                            .font(.alibabaPuHuiTi(size: 24.0, weight: .semiBold))
                            .foregroundStyle(.fs020000)
                            .padding(.bottom, 9.5)
                        if showTags {
                            HStack(spacing: 4.0) {
                                ForEach(model.food.tags, id: \.self) { tag in
                                    TagView(tag: tag)
                                }
                                Spacer()
                            }
                            .padding(.bottom, 14.5)
                        }
                        
                        Text(model.storeInfo.snapshot)
                            .font(.alibabaPuHuiTi(size: 15.0, weight: .regular))
                            .foregroundStyle(Color.fs575958)
                        // 店铺信息
                        StoreInfoView(model: model.storeInfo, showRightIcon: false)
                            .padding(12.0)
                            .background(
                                RoundedRectangle(cornerRadius: 12.0)
                                    .stroke(Color.fs000000.opacity(0.07), lineWidth: 1.0)
                            )
                            .padding(.vertical, 20.0)
                            .onTapGesture {
                                Log.debug("点击了商品")
                                //                                router.push(AppRoute.storeDetailView)
                            }
                        // 其它美食
                        HStack {
                            Text("餐厅其它美食")
                                .font(.alibabaPuHuiTi(size: 18.0, weight: .semiBold))
                                .foregroundStyle(Color.fs020000)
                                .padding(.bottom, 12.0)
                            Spacer()
                        }
                        HStack(spacing: 8) {
                            ForEach(model.otherFoods, id: \.id) { food in
                                FoodItemView(model: food)
                            }
                        }

                        Spacer()
                    }
                    .padding(.horizontal, 12.0)
                    .padding(.vertical, 16.0)
                    .background(
                        UnevenRoundedRectangle(topLeadingRadius: 20.0, topTrailingRadius: 20.0)
                            .fill(Color.fsFFFFFF),
                    )
                    .offset(y: -20.0)
                }
                .background(Color.fsFFFFFF)
            }
        }
        .ignoresSafeArea(.container, edges: .vertical)
        .background(Color.fsFFFFFF)
        .overlay(alignment: .topLeading) {
            RoundBackButton(bgColor: .white)
                .padding(.leading, 12.0)
        }
        .navigationBarHidden(true)
        .task {
            await getFoodDetail()
       }
    }
    
    private func getFoodDetail() async {
        do {
            indicator.show(content: .loading)
            let target = API.foodDetail(id: foodId)
            let respModel = try await NetworkManager.shared.request(target, responseType: FoodDetailDataRespModel.self)
            model = FoodDetailModel(resp: respModel.data)
            indicator.hide()
        } catch {
            indicator.hide()
            if let error = error as? BaseError {
                popup.show(content: error.message)
            }
        }
    }
}

#Preview {
    FoodDetailView(foodId: 4)
        .environment(Router())
        .environment(PopupModel())
        .environment(IndicatorModel())
}
